import React, { Component } from 'react'
import './index.css'
import { nanoid } from 'nanoid'
export default class Header extends Component {
  

  onkeyDown = (event) => {
    console.log('@',event)
    const {keyCode,target}=event
    // 不是回撤键被按下  
    if(keyCode!==13)return 
    const todoObj={id:nanoid(),name:target.value,done:false}
    console.log('@@',this.props)
    this.props.addTodo(todoObj)
    // 清空 输入框的内容 
    event.target.value=''

    
  }
  render() {
    return (
      <div className='todo-header'>
         <input onKeyDown={this.onkeyDown}  type="text"  placeholder='请输入你的任务名称,按回车键确认'/>
      </div>
    )
  }
}
